<template>
    <div id="ProductListTwo">
        <el-row>
            <el-col :span="12">
                <el-table :data="products">
                    <el-table-column
                        prop="name"
                        label="产品名称"
                        width="180">
                    </el-table-column>
                    <el-table-column
                        prop="price"
                        label="价格"
                        width="180">
                    </el-table-column>
                </el-table>
            </el-col>
            <el-col :span="12">
                <el-table :data="salesProducts">
                    <el-table-column
                        prop="name"
                        label="产品名称"
                        width="180">
                    </el-table-column>
                    <el-table-column
                        prop="price"
                        label="价格"
                        width="180">
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
    computed:{
        products:function(){
            return this.$store.state.products;
        },
        // salesProducts:function(){
        //     return this.$store.getters.salesProducts;
        // },
        ...mapGetters([
            'salesProducts'
        ])
    }
}
</script>

<style>

</style>
